import 'package:bot_toast/bot_toast.dart';
import 'package:flutter/material.dart';
import 'package:wallpaper/components/button/normal_button.dart';
import 'package:wallpaper/components/input/normal_input.dart';
import 'package:wallpaper/components/my_types.dart';
import 'package:wallpaper/model/mohu_types.dart';
import 'package:wallpaper/pages/other/mohu/mohu_imgs.dart';

class MohuPage extends StatefulWidget {
  const MohuPage({super.key});

  @override
  State<MohuPage> createState() => _MohuPageState();
}

class _MohuPageState extends State<MohuPage> with TickerProviderStateMixin {
  TextEditingController controller = TextEditingController();
  List types = [];
  List allTags = [];
  List selectTags = ['二次元综合', '游戏系列'];
  List selectTypes = [];
  List selectTypesChild = [];
  List<TypesBase> resultTypesChild = [];
  String iconBase =
      'https://gitee.com/zsnoin-can/new-wall-paper-apk/raw/master/mohu';

  void getTypes() {
    setState(() {
      types = MohuTypes().types;
      allTags = types.map((e) {
        return [
          e['value'],
          e['label'].toString(),
        ];
      }).toList();
    });
  }

  void getSelectTagsChild() {
    selectTypesChild = [];
    selectTypes = types
        .where((element) => selectTags.contains(element['value']))
        .toList();
    for (var i = 0; i < selectTypes.length; i++) {
      selectTypesChild.addAll(selectTypes[i]['children']);
    }
    setState(() {
      resultTypesChild = selectTypesChild.map((e) {
        return TypesBase(
          name: e['label'].toString(),
          page: MohuImgs(
            title: e['label'].toString(),
            type: e['value'].toString(),
          ),
          bg: "$iconBase/${e['value']}.jpg",
        );
      }).toList();
    });
  }

  @override
  void initState() {
    super.initState();
    getTypes();
    getSelectTagsChild();
  }

  @override
  Widget build(BuildContext context) {
   final  ColorScheme theme = Theme.of(context).colorScheme;
    return Scaffold(
      appBar: AppBar(
        toolbarHeight: 45,
        backgroundColor: theme.primaryContainer,
        surfaceTintColor: theme.primaryContainer,
        elevation: 0,
        title: NormalInput(
          height: 34,
          controller: controller,
          onSubmitted: (v) {
            setState(() {
              List result = selectTypesChild
                  .where((element) => element['label'].toString().contains(v))
                  .toList();
              resultTypesChild = result.map((e) {
                return TypesBase(
                  name: e['label'].toString(),
                  page: MohuImgs(
                    title: e['label'].toString(),
                    type: e['value'].toString(),
                  ),
                  bg: "$iconBase/${e['value']}.jpg",
                );
              }).toList();
            });
            FocusScope.of(context).requestFocus(FocusNode());
          },
        ),
      ),
      endDrawer: Drawer(
        // 设置圆角
        shape: const RoundedRectangleBorder(
          borderRadius: BorderRadius.all(Radius.zero),
        ),
        backgroundColor: Colors.black.withOpacity(0.5),
        child: Container(
          width: double.infinity,
          height: double.infinity,
          margin: EdgeInsets.only(top: 50, bottom: 20, left: 15, right: 15),
          child: Column(
            children: [
              Expanded(
                child: ListView(
                  children: [
                    Wrap(
                      spacing: 10,
                      runSpacing: 10,
                      alignment: WrapAlignment.start,
                      children: [
                        for (var i = 0; i < allTags.length; i++)
                          buildImageTypes(selectTags, i, theme, allTags),
                      ],
                    ),
                  ],
                ),
              ),
              SizedBox(
                height: 35,
                child: NormalButton(
                  title: '搜素',
                  radius: 3,
                  bgColor: Colors.white.withOpacity(0.2),
                  onPressed: () {
                    if (selectTags.isEmpty) {
                      BotToast.showText(text: '至少选择一个分类');
                      return;
                    }
                    controller.clear();
                    getSelectTagsChild();
                    FocusScope.of(context).requestFocus(FocusNode());
                    Navigator.of(context).pop();
                  },
                ),
              )
            ],
          ),
        ),
      ),
      body: MyTypes(
        wallpapges: resultTypesChild,
        vertical: true,
        isScroll: true,
      ),
    );
  }

  Widget buildImageTypes(
      List selectTags, int i, ColorScheme theme, List types) {
    return Material(
      // 圆角
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(3),
      ),
      color: selectTags.contains(types[i][0])
          ? theme.primary
          : Colors.white.withOpacity(0.2),
      clipBehavior: Clip.antiAlias,
      child: InkWell(
        onTap: () {
          if (selectTags.contains(types[i][0])) {
            setState(() {
              selectTags.remove(types[i][0]);
            });
          } else {
            setState(() {
              selectTags.add(types[i][0]);
            });
          }
        },
        child: Padding(
          padding: const EdgeInsets.only(
            left: 10,
            right: 10,
            top: 5,
            bottom: 5,
          ),
          child: Text(
            types[i][1],
            style: TextStyle(
              color: Colors.white,
            ),
          ),
        ),
      ),
    );
  }
}
